<template>
  <div>
    <el-card style="margin-top: -5px">
      <div  class="d1">
        <div>
          <span><h3 style="color: mediumblue" align="center">发  票  查  看</h3></span>
        </div>
      </div>
      <div class="d2">
        <el-input  placeholder="请输入申请发票金额" v-model="piInvoiceForm.amount" style="width: 240px;margin-right: 50px"></el-input>
        <el-input  placeholder="请输入邮寄公司" v-model="piInvoiceForm.logisticsCym" style="width: 240px"></el-input>
        <el-input  placeholder="请输入邮寄单号" v-model="piInvoiceForm.logisticsCode" style="width: 240px;margin-left: 50px"></el-input>

        <el-button type="primary" style="margin-left: 50px;width: 120px" @click="findpayList(nowUser.id)">搜    索</el-button>
        <el-button type="primary" @click="findYc(nowUser.id)" plain>显示隐藏订单</el-button>
      </div>
      <span v-if="piInvoice.length<=0"><h1 style="color: #409EFF">暂时没有发票信息</h1></span>
      <div class="d2" v-for="item in piInvoice" style="margin-top: -10px">
        <div style="float: left;margin-left: 20px;margin-top: 20px;">
          <el-card class="box-card" style="height: 650px;background-color: beige;margin-bottom: 50px">
            <div slot="header" class="clearfix">
              <div>
                <span><h3 style="color: #409EFF" align="center">发  票  查  看</h3></span>
              </div>
            </div>
            <div class="text item" style="background-color: beige">
              <el-row :gutter="20">
                {{'发票编号 : '+item.code}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                发票类型 : {{item.invoiceType | invoiceTypegv}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'发票抬头 : '+item.invoiceTitle}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'税号 : '+item.invoiceNum}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'税率 : '+item.taxRate}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'开票金额 : '+item.amount}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'发票内容 : '+item.content}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'收件人 : '+item.receiver}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'收货地址 : '+item.revAddress}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20">
                {{'联系电话 : '+item.tel}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20" v-if="item.state==3 || item.state==4">
                {{'物流公司 : '+item.logisticsCym}}
              </el-row>
              <el-row :gutter="20" v-if="item.state==2">
                {{'驳回原因 : '+item.remarks}}
              </el-row>
              <el-row class="box" style="background-color: beige" v-if="item.state==3  || item.state==4"></el-row>
              <el-row :gutter="20" v-if="item.state==2 && item.isDelete==1" >
                <div style="height: 25px"></div>
              </el-row>
              <el-row :gutter="20" style="color: red">
                当前状态 :{{item.state | stategl}}
              </el-row>
              <el-row class="box" style="background-color: beige"></el-row>
              <el-row :gutter="20" v-if="item.state==3">
                <el-button @click="zt(item.id,4)" type="success">确认收货</el-button>
              </el-row>
              <el-row :gutter="20" v-if="item.isDelete==1 && item.state==2" >
                <el-button @click="delInvoice(item.id)" type="danger">删除发票</el-button>
              </el-row>
              <el-row :gutter="20" v-if="item.isDelete==1 && item.state==4" >
                <el-button @click="ycorder(item.id)" type="info">隐藏发票</el-button>
              </el-row>
            </div>
          </el-card>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
  export default {
    name: "PayList",
    data() {
      return {
        piInvoice:[],
        nowUser:{},
        piInvoiceForm:{}
      }
    },
    filters:{
      stategl(val){
        if(val==0){
          return "待审核"
        }else if(val==1){
          return "审核通过"
        }else if(val==2){
          return "审核未通过"
        }else if(val==3){
          return "已邮寄"
        }else if(val==4){
          return "已确认收货"
        }
      },
      invoiceTypegv(val){
        if(val==0){
          return "增值税普通发票"
        }else if(val==1){
          return "增值税专用发票"
        }
      }
    },
    methods:{
      delInvoice(id){
        this.$http.post("/Invoice/pi-invoice/delInvoice/" + id ,this.nowUser).then((res) => {
          if (res.data.success) {
            this.$message.success(res.data.message);
            this.findpayList(this.nowUser.id)
          } else {
            this.$message.error(res.data.message);
          }
        })
      },
      ycorder(id){
        this.$http.post("/Invoice/pi-invoice/ycorder/" + id ,this.nowUser).then((res) => {
          if (res.data.success) {
            this.$message.success(res.data.message);
            this.findpayList(this.nowUser.id)
          } else {
            this.$message.error(res.data.message);
          }
        })
      },
      findYc(id){
        this.$http.get("/Invoice/pi-invoice/findYc/"+id).then((res) => {
          if (res.data.success) {
            this.piInvoice=res.data.result
            this.$message.success(res.data.message)
          } else {
            this.$message.error(res.data.message);
          }
        })
      },
      zt: function (id, zt) {
        this.$http.post("/Invoice/pi-invoice/updatezt/" + id +"/"+zt,this.nowUser).then((res) => {
          if (res.data.success) {
            this.$message.success(res.data.message);
            this.findpayList(this.nowUser.id)
          } else {
            this.$message.error(res.data.message);
          }
        })
      },
      findpayList(id){
        this.$http.post("/Invoice/pi-invoice/findpayList/"+id,this.piInvoiceForm).then((res) => {
          if(res.data.success){
            this.piInvoice=res.data.result
            this.$message.success(res.data.message)
          }else{
            this.$message.error(res.data.message)
          }
        })
      },

    },
    mounted() {
      this.nowUser=JSON.parse(sessionStorage.getItem("customer"))
      this.findpayList(this.nowUser.id)
    }
  }
</script>

<style scoped>
  .d1 {
    border-bottom: 1px solid #333744;
    margin-top: -20px;
  }
  .d2 {
    margin: 20px
  }
  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    width: 480px;
  }
  .box{
    height: 20px;
    background-color: #ffffff;
  }
</style>
